<template>
	<HeaderNav />
	<article>
		<!-- 网站主体 -->
		<div id="main">
			<section class="ct">
            <h1 class="detail-score">我的订单</h1>
            <div class="bg-hr"></div>
				
            <div class="order">
               <OrderDetail v-for="(order, index) in orderList" 
                  :key="order.id" 
                  :order="order" />
            </div>

            <VanPagination v-model="page" :totalItems="total" :itemsPerPage="pageSize" :showPageSize="5" 
					:forceEllipses="true" />
			</section>
			
		</div>
	</article>
	<Footer />
</template>

<script>
import HeaderNav from "../components/HeaderNav.vue";
import Footer from "../components/Footer.vue";
import Official from '../components/message/Official.vue'
import Notify from '../components/message/Notify.vue'
import BlockList from '../components/message/BlockList.vue'
import OrderDetail from '../components/OrderDetail.vue'
import VanPagination from '../components/VanPagination.vue' ;


export default {
	components: {
		HeaderNav, 
		Footer, 
		Official ,
		Notify, 
		BlockList,
      VanPagination, 
      OrderDetail
	},
	props: {
		type: {
			required: true, 
			type: String,  
		}
	},
   data() {
      return {
         page: 1, 
         pageSize: 10, 
         total: 100,
         orderList: [ // lifeTime 最后存活时间，单位秒
            {id: 1,  orderNum: "123535346545747243", type: "会员充值", createTime: "2023-08-22 14:21:45", state: 0, lifeTime: 600} ,
            {id: 2,  orderNum: "123535346545747245", type: "会员充值", createTime: "2023-08-21 11:46:26", state: -1} ,
            {id: 2,  orderNum: "123535346545747247", type: "会员充值", createTime: "2023-08-13 15:04:41", state: 0, lifeTime: 200} ,
            {id: 1,  orderNum: "123535346545747243", type: "会员充值", createTime: "2023-08-22 14:21:45", state: 1} ,
            {id: 2,  orderNum: "123535346545747240", type: "会员充值", createTime: "2023-08-21 11:46:26", state: -1} ,
         ]
      }
   }
	
}
</script>

<style scoped>
.order {
   position: relative;
   margin-top: 60px;
}

</style>